<!DOCTYPE html>
<html>

<head>
	<meta charset="UTF-8">
	<title>服务管理</title>
	<link rel="stylesheet" href="plugins/layui/css/layui.css" media="all" />
	<link rel="stylesheet" href="css/global.css" media="all">
	<link rel="stylesheet" href="plugins/font-awesome/css/font-awesome.min.css">
	<link rel="stylesheet" href="css/table.css" />
</head>
<body>
	<div class="admin-main">
		<blockquote class="layui-elem-quote">
			<form class="layui-form" method="get" action="" enctype="multipart/form-data" class="layui-form">

				<div class="layui-form-item" style="margin:0;display:inline-block;">
					<label class="layui-form-label">状态</label>
					<div class="layui-input-inline">
						<div class="layui-input-inline" id="statusSelect">
						</div>
					</div>
					<div class="layui-input-inline">
						<input type="text" name="userId" placeholder="用户id" autocomplete="off" class="layui-input">
					</div>
					<!-- <div class="layui-input-inline">
						<input type="text" name="orderNum" placeholder="订单号" autocomplete="off" class="layui-input">
					</div> -->
						<label class="layui-form-label">时间范围</label>
						<div class="layui-input-inline">
							<input class="layui-input" name="startTime"  placeholder="开始日期" id="LAY_demorange_s">
						</div>
						<div class="layui-input-inline">
							<input class="layui-input" name="endTime" placeholder="截止日期" id="LAY_demorange_e">
						</div>
					<div class="layui-form-mid layui-word-aux" style="padding:0;">
						<button lay-filter="search" class="layui-btn" id="search" lay-submit><i class="fa fa-search" aria-hidden="true"></i> 查询</button>
					</div>
				</div>
			</form>
		</blockquote>
		<fieldset class="layui-elem-field">
			<legend>支付账单</legend>
			<div class="layui-field-box layui-form">
				<table class="layui-table admin-table">
					<thead>
						<tr>
							<th style="width: 30px;">订单号</th>
							<th>支付金额</th>
							<th>退款金额</th>
							<th>支付方式</th>
							<th>付款账号</th>
							<th>付款时间</th>
							<th>操作</th>
						</tr>
					</thead>
					<tbody id="content">
					</tbody>
				</table>
			</div>
		</fieldset>
		<div class="admin-table-page">
			<div id="paged" class="page">

			</div>
		</div>
	</div>

	<!--模板-->
	<script type="text/html" id="tpl_select">
		<select name="status" lay-verify="required">
				<option value="1" <% if($data.status==1) print("selected") %> >支付未消费</option>
				<option value="2" <% if($data.status==2) print("selected") %> >支付已消费</option>
		</select>
	</script>
	<script type="text/html" id="tpl">
		<% for(var i=0;i<list.length;i++){ %>
		<tr data-id="<%==list[i].caid %>">
			<td>
				<%==list[i].allOrderNum%>
			</td>
			<td>
				<%==list[i].totalAmount %>
			</td>
			<td>
				<%==list[i].refundFee||'0.0' %>
			</td>
			<td>
				<% var payWay=["支付宝","微信"]; %>
				<%==payWay[list[i].payWay] %>
			</td>
			<td>
				<%==list[i].buyerLogonId %>
			</td>
			<td>
				<%==list[i].gmtPayment %>
			</td>
			<td>
				<a  href="/admin/bill/info?id=<%==list[i].allOrderNum %>" class="info layui-btn layui-btn-normal layui-btn-mini">查看详细</a>
				<!-- <a onclick="deleteData(<%==list[i].caid %>)" data-opt="del" class="layui-btn layui-btn-danger layui-btn-mini">删除</a> -->
			</td>
		</tr>
		<% } %>
	</script>

	<script type="text/javascript" src="plugins/layui/layui.js"></script>
	<script type="text/javascript" src="js/template.js"></script>
	<script type="text/javascript" src="js/public.js"></script>
	<script type="text/javascript" src="js/jquery.min.js"></script>
	<script>
		var data;
		var page = 1;
		var size = 10;
		//initPage(page,size);
		var pageData;
		var status = getUrlParam("status");
		var userId = getUrlParam("userId");
		var startTime = getUrlParam("startTime");
		var endTime = getUrlParam("endTime");
		if(userId==null){
			userId='';
		}
		var orderNum = getUrlParam("orderNum");
		var selectSata = {
			status:status
		};
		statusSelect = template("tpl_select", selectSata);
		document.getElementById("statusSelect").innerHTML = statusSelect;

		layui.use(['laypage', 'layer', 'form','laydate'], function() {
			var form = layui.form();
			var laypage = layui.laypage,
				layer = layui.layer;
			var	laydate = layui.laydate;
			console.log(laydate);
			var $ = layui.jquery;
			var totalPage = getPage(size);
			laypage({
				cont: 'paged',
				pages: totalPage,
				skip: true,
				jump: function(obj, first) {
					initPage(obj.curr, size);
				}
			});

			var start = {
				min: '2017-06-18 23:59:59',
				max: '2099-06-16 23:59:59',
				istoday: false,
				choose: function(datas) {
					end.min = datas; //开始日选好后，重置结束日的最小日期
					end.start = datas //将结束日的初始值设定为开始日
				}
			};

			var end = {
				min: laydate.now(),
				max: '2099-06-16 23:59:59',
				istoday: false,
				choose: function(datas) {
					start.max = datas; //结束日选好后，重置开始日的最大日期
				}
			};

			document.getElementById('LAY_demorange_s').onclick = function() {
				start.elem = this;
				laydate(start);
			}
			document.getElementById('LAY_demorange_e').onclick = function() {
				end.elem = this
				laydate(end);
			}
		});





		function initPage(page, size) {
			$.ajax({
				url: '/admin/bill/list/' + page + '?pageSize=' + size+"&status="+status+"&userId="+userId,
				dataType: 'json',
				data:{
					startTime:startTime,
					endTime:endTime
				},
				async: false,
				success: function(response) {
					if(response.code == 200) {
						data = response;
						for (var i = 0; i < data.result.list.length; i++) {
							data.result.list[i].gmtPayment = data.result.list[i].gmtPayment==null ? '':new Date(data.result.list[i].gmtPayment).format("YYYY-MM-dd");
						}
					}
				}
			});
			var html = template('tpl', data.result);
			document.getElementById('content').innerHTML = html;
		}

		function getPage(size) {
			var totalPage;
			var url = '/admin/bill/list/' + page + '?pageSize=' + size+"&status="+status+"&userId="+userId;
			$.ajax({
				url: url,
				dataType: 'json',
				data:{
					startTime:startTime,
					endTime:endTime
				},
				async: false,
				success: function(response) {
					totalPage = response.result.totlepage;

				}
			});
			return totalPage;
		}


		function deleteData(id) {
			layer.open({
				content: '你确定要删除么?',
				btn: ['确定', '取消'],
				yes: function(index, layero) {
					//按钮【按钮一】的回调
					$.ajax({
						url: '/admin/bill/delete/' + id,
						dataType: 'json',
						async: false,
						success: function(response) {
							layer.close(index);
							if(response.code == 200) {
								toast("删除成功");
								$("tr[data-id='" + id + "']").hide();
							} else {
								toast("删除失败");
							}
						}
					});

				}
			});
		}

	</script>
</body>

</div>

</html>
